<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
    pageEncoding="ISO-8859-1"%>
<%@ taglib prefix="decorator" uri="http://claudiushauptmann.com/jsp-decorator/"%>
<%@ page import="vn.fpt.fsoft.entity.User" %>

<decorator:decorate filename="MasterPage.jsp">
    <decorator:content placeholder="title">Add Trust District</decorator:content>
    <decorator:content placeholder="head">
<link href="css/bootstrap.min.css"
	rel="stylesheet" type="text/css" />
<link href="css/style-1.css" rel="stylesheet" type="text/css" />
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js"></script>
<script type="text/javascript" src="http://getbootstrap.com/dist/js/bootstrap.min.js"></script>
<script type="text/javascript" src="http://bootboxjs.com/bootbox.js"></script>

<script>
	function goBack() {
		window.location.replace("AmendTrustRegion.jsp?regionID="+ <%=request.getParameter("regionID")%>);
	}
	function isValidate() {
		var name = $("#name").val();
		if (name == "") {
			return false;
		} else {
			return true;
		}
	}
	function saveDistrict() {
		if (isValidate()) {
			bootbox.confirm("Are you sure you  want to save it?", function(
					result) {
				if (result == true) {
					var regionID = $("#regionID").val();
					var regionName = $("#regionName").val();
					var name = $("#name").val();
					var description = $("#description").val();
					$("#invalid").html("");
					$.ajax({
						url : "AddTrustDistrict?action=add&regionID="
								+ regionID + "&regionName=" + regionName
								+ "&name=" + name + "&description="
								+ description,
						type : "GET",
						success : function(data) {
							$("#name").val("");
							if(data.indexOf("success")>=0)
							{
								$("#name").css("border-color", "");
								$("#invalid").html(data);
								$("#invalid").css("color", "green");
							}else
							{
								$("#name").css("border-color", "red");
								$("#invalid").html(data);
								$("#invalid").css("color", "red");
							}
						},
						error : function(data) {
							alert("Saving fails!");
							$("#invalid").html(data);
							$("#invalid").css("color", "red");
						}
					});
				} else {

					$("#invalid").html("");
					$("#name").val("");
					$("#description").val("");
					$("#name").focus();
				}
			});

		} else {
			$("#name").css("border-color", "red");
			$("#invalid").html("Trust district name can not null");
		}
	}
	$(document).ready(function() {
		$("#tabs").tabs();
		$(window).load(function() {
			$.ajax({
				url : "AddTrustDistrict?action=getdata&regionID="+<%=request.getParameter("regionID")%>,
				type : "GET",
				success : function(data) {
					$("#region").append(data);
				},
				error : function(data) {
					alert("fail");
				}
			});
		});
	});
</script>
</decorator:content>
<decorator:content placeholder="body">
	<%
		User user = (User) request.getSession().getAttribute("user");
		if(user == null) {
		    response.sendRedirect("login.jsp");
		}
	%>
	<p style="color: #0C3; font-size: 24px; font-weight: bold;">Trust
		District Details</p>
	<div id="tabs" style="width: 795px;">
		<ul>
			<li><a href="#detail1">Detail</a></li>
			<li style="float: right"><input type="button" value="Save"
				onclick="saveDistrict();" /> &nbsp;&nbsp; <input type="button"
				value="Back" onclick="goBack();" /></li>
		</ul>
		<div id="detail1" style="background-color: #EFEFEF;">
			<table style="width: 703px;">
				<tr>
					<td width="206">TrustRegion&nbsp;&nbsp;&nbsp;&nbsp;<label
						style="color: red;">*</label></td>
					<td width="481"><div id="region"
						style="width: 35%; height: 20px;"></div></td>
				</tr>
				<tr>
					<td height="64">Trust District Name&nbsp;&nbsp;&nbsp;&nbsp;<label
						style="color: red;">*</label></td>
					<td><input id="name" type="text" size="30" /></td>
				</tr>
				<tr>
					<td>Description</td>
					<td><textarea id="description" rows="4" cols="30"></textarea></td>
				</tr>
			</table>
			<br /> <br /> <br />
			<p id="invalid" style="color: #F00; font-size: 14px"></p>
		</div>
	</div>
    </decorator:content>
</decorator:decorate>
